<template>
  <BaseDialog
    :title="(!props.item.dictionaryId ? '新增' : '编辑') + '字典选项'"
    :handleCancel="handleCancel"
    :dialogVisible="props.dialogVisible"
  >
    <BaseForm
      labelWidth="90px"
      type="rule"
      :handleOk="handleOk"
      :handleCancel="handleCancel"
      :items="formItems"
      v-model:form="ruleForm"
      :rules="rules"
      :refresh="handleSearch"
    >
    </BaseForm>
  </BaseDialog>
</template>

<script setup lang="ts">
import { commonService } from '@/api/common'

const props = defineProps({
  dialogVisible: {
    type: Boolean,
  },
  item: {
    type: Object,
  },
  handleSearch: {
    type: Function,
  },
})
const emit = defineEmits(['update:dialogVisible'])

const formItems = ref([
  {
    name: '名称',
    key: 'dictionaryName',
    type: 'input', 
  },
 /*  {
    name: '键',
    key: 'dictionaryKey',
    type: 'input',
  },
  {
    name: '值',
    key: 'dictionaryValue',
    type: 'input',
  }, */
  {
    name: '排序数字',
    key: 'sortNum',
    type: 'number',
    placeholder: '请输入排序数字，数字越小越靠前',
    min: 0,
  },
])
const rules = reactive({
  dictionaryName: [{ required: true, message: '请输入', trigger: 'change' }, { max: 255, message: '最长255个字符' }],
  dictionaryKey: [{ required: true, message: '请输入', trigger: 'change' }, { max: 40, message: '最长40个字符' }],
  dictionaryValue: [{ required: true, message: '请输入', trigger: 'change' }, { max: 40, message: '最长40个字符' }],
})
const ruleForm = ref({
  parentId: '',
  dictionaryId: '',
  dictionaryName: '',
 /*  dictionaryKey: '',
  dictionaryValue: '', */
  sortNum: ref<Number>(),
})
const handleOk = () => {
  if (props.item.dictionaryId) {
    return commonService.editDictionary({
      data: { ...ruleForm.value },
    })
  } else {
    return commonService.addDictionary({
      data: { ...ruleForm.value },
    })
  }
}

const handleCancel = () => {
  emit('update:dialogVisible', false)
}
onMounted(() => {
  ruleForm.value.parentId = props.item.parentId
  if (props.item.dictionaryId) {
    ruleForm.value.dictionaryId = props.item.dictionaryId
    ruleForm.value.dictionaryName = props.item.dictionaryName
  /*   ruleForm.value.dictionaryKey = props.item.dictionaryKey
    ruleForm.value.dictionaryValue = props.item.dictionaryValue */
    ruleForm.value.sortNum = props.item.sortNum
  }
})
</script>

<style lang="scss" scoped></style>
